<template>
  <el-popover
      ref = "popoverRef"
      :virtual-ref = "buttonRef"
      trigger = "click"
      :width = "550"
      title = "图标列表"
      virtual-triggering
  >
    <ul class = "system-icon">
      <li v-for = "sdata in iconList" @click = "selectIcon(sdata.menuIcon)"
          :class = "sdata.menuIcon==currentLineInfo['menuIcon']?'icon-active':''">
        <el-tooltip :content = "sdata.label">
          <user-icon :icon = "sdata.menuIcon"
                     style = "color:#409EFF;vertical-align: middle;font-size: 48px"/>
        </el-tooltip>
      </li>
    </ul>
  </el-popover>
  <star-horse-dialog :visible = "dialogTableVisible" :title = "dialogTitle" is-batch = "true" @merge = "merge"
                     @mergeDraft = "mergeDraft" :draggable = "true"
                     @reset = "resetForm">
    <el-form :model = "ruleForm" :rules = "rules" class = "demo-ruleForm" ref = "ruleForm">
      <el-form-item label = "主键" prop = "idMenusinfo" v-if = "false">
        <el-input clearable placeholder = "请输入主键"
                  v-model = "ruleForm.idMenusinfo"></el-input>
      </el-form-item>
      <el-form-item label = "系统信息" prop = "informationsSingleId"
                    required v-if = "!false">
        <el-select
            clearable
            filterable
            placeholder = "请选择系统信息"
            v-model = "ruleForm.informationsSingleId">
          <el-option
              :key = "sitem.idInformations"
              :label = "sitem.sysName"
              :value = "sitem.idInformations"
              v-for = "sitem in informationsSingleIdList"
          >
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item label = "状态" prop = "statusName"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入状态名称"
                  v-model = "ruleForm.statusName"></el-input>
      </el-form-item>

      <el-table
          :data = "ruleForm.batchDataList" :row-class-name = "rowClassName"
          @selection-change = "handleDetailSelectionChange"
          border
          fit = "true"

          stripe = "true"
          ref = "tb">
        <!--  <el-table-column align="center" type="selection" width="50"/>-->
        <el-table-column align = "center" fixed = "left" label = "序号" prop = "xh" width = "80"></el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "父菜单"
            min-width = "200px"
            prop = "parentNo"
            sortable
            v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :prop = "'batchDataList.'+scope.$index+'.parentNo'"
                          v-if = "!false">
              <el-select clearable
                         filterable
                         placeholder = "请选择父级菜单"
                         v-model = "scope.row.parentNo">
                <el-option
                    :key = "sitem.dataNo"
                    :label = "sitem.menuName"
                    :value = "sitem.dataNo"
                    v-for = "sitem in parentNodeList"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单名称"
            min-width = "200px"
            prop = "menuName"
            required
            sortable v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :rules = "rules.menuName" :prop = "'batchDataList.'+scope.$index+'.menuName'"
                          required v-if = "!false">
              <el-input
                  v-model = "scope.row.menuName"
                  clearable
                  placeholder = "请输入菜单名"
              />

            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单路径"
            min-width = "200px"
            prop = "menuPath"
            sortable
            v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :rules = "rules.menuPath" :prop = "'batchDataList.'+scope.$index+'.menuPath'"
                          required v-if = "!false">
              <el-input
                  clearable
                  v-model = "scope.row.menuPath"
                  placeholder = "请输入菜单路径"
              />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单图标"
            min-width = "200px"
            prop = "menuIcon"
            sortable
            v-if = "true ">
          <template #default = "scope">
            <el-form-item :rules = "rules.menuIcon" :prop = "'batchDataList.'+scope.$index+'.menuIcon'"
                          required v-if = "!false">
              <el-input ref = "buttonRef" v-model = "scope.row.menuIcon" @click = "(evt)=>iconOper(scope,evt)"
                        placeholder = "请选择菜单图标"/>
              <!-- <el-popover placement="bottom" :width="550" :height="350" trigger="click">
                   <template #reference>
                       <el-input v-model="scope.row.menuIcon" placeholder="请选择菜单图标"/>
                   </template>
                   <ul class="system-icon">
                       <li v-for="sdata in iconList" @click="scope.row.menuIcon=sdata.menuIcon" :class="scope.row.menuIcon==sdata.menuIcon?'icon-active':''"  >
                           <el-tooltip :content="sdata.label">
                               <user-icon :icon="sdata.menuIcon" style="color:#409EFF;vertical-align: middle;font-size: 48px"/>
                           </el-tooltip>
                       </li>
                   </ul>
               </el-popover>-->
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单编码"
            min-width = "200px"
            prop = "menuCode"
            sortable
            v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :rules = "rules.menuCode" :prop = "'batchDataList.'+scope.$index+'.menuCode'"
                          required v-if = "!false">
              <el-input clearable placeholder = "请输入菜单编码"
                        v-model = "scope.row.menuCode"></el-input>
            </el-form-item>
          </template>

        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单顺序"
            min-width = "200px"
            prop = "dataIndex"
            sortable
            v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :rules = "rules.dataIndex" :prop = "'batchDataList.'+scope.$index+'.dataIndex'"
                          v-if = "!false">
              <el-input-number clearable placeholder = "请输入菜单顺序"
                               v-model = "scope.row.dataIndex"></el-input-number>
            </el-form-item>
          </template>

        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单顺序"
            min-width = "200px"
            prop = "dataIndex"
            sortable
            v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :rules = "rules.statusCode"
                          prop = "'batchDataList.'+scope.$index+'.statusCode'"
                          v-if = "!false">
              <el-select placeholder = "请选择状态" v-model = "scope.row.statusCode">
                <el-option
                    :key = "sitem.statusCode"
                    :label = "sitem.statusName"
                    :value = "sitem.statusCode"
                    clearable
                    v-for = "sitem in selectData"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column
            :formatter = "dataFormat"
            label = "菜单描述"
            min-width = "200px"
            prop = "menuDesc"
            sortable
            v-if = "true "
        >
          <template #default = "scope">
            <el-form-item :prop = "'batchDataList.'+scope.$index+'.menuDesc'"
                          v-if = "!false">
              <el-input clearable placeholder = "请输入菜单描述"
                        v-model = "scope.row.menuDesc"></el-input>
            </el-form-item>
            <el-form-item :prop = "'batchDataList.'+scope.$index+'.dataNo'"
                          v-if = "!true">
              <el-input clearable placeholder = "请输入系统编号"
                        v-model = "scope.row.dataNo"></el-input>
            </el-form-item>
            <el-form-item :prop = "'batchDataList.'+scope.$index+'.updatedBy'"
                          v-if = "!true">
              <el-input clearable placeholder = "请输入修改人"
                        v-model = "scope.row.updatedBy"></el-input>
            </el-form-item>
            <el-form-item :prop = "'batchDataList.'+scope.$index+'.updatedDate'"
                          v-if = "!true">
              <el-date-picker clearable placeholder = "请选择修改日期" type = "date"
                              v-model = "scope.row.updatedDate">
              </el-date-picker>
            </el-form-item>

            <el-form-item :prop = "'batchDataList.'+scope.$index+'.createdBy'"
                          v-if = "!true">
              <el-input clearable placeholder = "请输入创建人"
                        v-model = "scope.row.createdBy"></el-input>
            </el-form-item>

            <el-form-item :prop = "'batchDataList.'+scope.$index+'.createdDate'"
                          v-if = "!true">
              <el-date-picker clearable placeholder = "请选择创建日期" type = "date"
                              v-model = "scope.row.createdDate">
              </el-date-picker>
            </el-form-item>

            <el-form-item :prop = "'batchDataList.'+scope.$index+'.isDel'"
                          v-if = "!true">
              <el-input-number clearable placeholder = "请输入是否删除 1 是 0否"
                               v-model = "scope.row.isDel"/>
            </el-form-item>
          </template>

        </el-table-column>
        <el-table-column fixed = "right" label = "操作" min-width = "150px">
          <template #header = "scope">
            <span>操作</span>&nbsp;&nbsp;
            <el-button @click = "handleAddDetails(scope.row,1)" link size = "mini" type = "primary">
              <el-tooltip content = "添加一行">
                <user-icon icon = "plus" style = "vertical-align: middle;color:#409EFF;"/>
              </el-tooltip>
            </el-button>
          </template>
          <template #default = "scope">
            <el-button v-if = "scope.row.xh==ruleForm.batchDataList.length" @click = "handleAddDetails(scope.row,1)"
                       link size = "mini" type = "primary">
              <el-tooltip content = "添加一行">添加</el-tooltip>
            </el-button>
            <el-button @click = "handleAddDetails(scope.row,2)" link size = "mini" type = "danger">
              <el-tooltip content = "删除当前行">删除</el-tooltip>
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form>

  </star-horse-dialog>
  <star-horse-dialog :visible = "moveDialogVisible" :title = "'菜单迁移'" @merge = "moveMerge" @mergeDraft = "mergeDraft"
                     :draggable = "true"
                     @reset = "resetForm">
    <el-form :model = "ruleForm" :rules = "rules" class = "demo-ruleForm" ref = "ruleForm">
      <el-form-item label = "主键" prop = "idMenusinfo" v-if = "false">
        <el-input clearable placeholder = "请输入主键"
                  v-model = "ruleForm.idMenusinfo"></el-input>
      </el-form-item>
      <el-row>
        <el-col :span = "12">
          <el-form-item label = "源系统信息" prop = "sourceInformationsSingleId"
                        required v-if = "!false">
            <el-select @change = "loadMenus"
                       clearable
                       filterable
                       placeholder = "请选择系统信息"
                       v-model = "ruleForm.sourceInformationsSingleId">
              <el-option
                  :key = "sitem.idInformations"
                  :label = "sitem.sysName"
                  :value = "sitem.idInformations"
                  v-for = "sitem in informationsSingleIdList"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span = "12">
          <el-form-item label = "目标系统信息" prop = "informationsSingleId"
                        required v-if = "!false">
            <el-select
                clearable
                filterable
                placeholder = "请选择系统信息"
                v-model = "ruleForm.informationsSingleId">
              <el-option
                  :key = "sitem.idInformations"
                  :label = "sitem.sysName"
                  :value = "sitem.idInformations"
                  v-for = "sitem in informationsSingleIdList"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
    <el-table
        :data = "appMenusList"
        row-key = "idMenusinfo"

        default-expand-all
        @selection-change = "moveSelectionChange"
        border
        class = "data_table"
        fit = "true"
        highlight-current-row = true
        stripe = "true"
    >
      <el-table-column fixed width = "1"/>
      <el-table-column
          :reserve-selection = "true"
          align = "center"
          fixed = "left"
          type = "selection"
      />
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单名称"
          min-width = "200px"
          prop = "menuName"
          sortable
          v-if = "true ">
      </el-table-column>

      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统名称"
          min-width = "200px"
          prop = "informationsPo.sysName"
          sortable
          v-if = "true ">
      </el-table-column>

      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单路径"
          min-width = "200px"
          prop = "menuPath"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单图标"
          min-width = "200px"
          prop = "menuIcon"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单顺序"
          min-width = "120px"
          prop = "dataIndex"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单描述"
          min-width = "200px"
          prop = "menuDesc"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统编号"
          min-width = "200px"
          prop = "dataNo"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单编码"
          min-width = "200px"
          prop = "menuCode"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "父菜单"
          min-width = "200px"
          prop = "parentNo"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改人"
          min-width = "200px"
          prop = "updatedBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改日期"
          min-width = "200px"
          prop = "updatedDate"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建人"
          min-width = "200px"
          prop = "createdBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建日期"
          min-width = "200px"
          prop = "createdDate"
          sortable
          v-if = " true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "是否删除 1 是 0否"
          min-width = "200px"
          prop = "isDel"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态编码"
          min-width = "200px"
          prop = "statusCode"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态"
          min-width = "200px"
          prop = "statusName"
          sortable
          v-if = "true ">
      </el-table-column>

    </el-table>

  </star-horse-dialog>
  <star-horse-dialog :visible = "viewVisible" :title = "'查看数据'" :is-view = "true">
    <div class = "item">
      <label>系统名称:</label>
      <div class = "content">{{ ruleForm.informationsPo["sysName"] }}</div>
    </div>
    <div class = "item">
      <label>父菜单编号:</label>
      <div class = "content">{{ ruleForm.parentNo }}</div>
    </div>
    <div class = "item">
      <label>菜单名称:</label>
      <div class = "content">{{ ruleForm.menuName }}</div>
    </div>
    <div class = "item">
      <label>菜单路径:</label>
      <div class = "content">{{ ruleForm.menuPath }}</div>
    </div>

    <div class = "item">
      <label>菜单图标:</label>
      <div class = "content">
        <user-icon :icon = "ruleForm.menuIcon"
        />
      </div>
    </div>
    <div class = "item">
      <label>菜单描述:</label>
      <div class = "content">{{ ruleForm.menuDesc }}</div>
    </div>
    <div class = "item">
      <label>创建人:</label>
      <div class = "content">{{ ruleForm.createdBy }}</div>
    </div>
    <div class = "item">
      <label>创建日期:</label>
      <div class = "content">{{ createDate(ruleForm.createdDate) }}</div>
    </div>
    <div class = "item">
      <label>状态名称:</label>
      <div class = "content">{{ ruleForm.statusName }}</div>
    </div>

  </star-horse-dialog>
  <el-card class = "inner_content">
    <el-form class = "search_area" size = "mini">
      <el-form-item label = "菜单名称">
        <el-input placeholder = "请输入菜单名称" @keydown.enter = "dataSearch" v-model = "searchForm.menuName"/>
      </el-form-item>
      <el-form-item label = "系统名称">
        <el-select placeholder = "请选择系统名称" @keydown.enter = "dataSearch"
                   v-model = "searchForm.informationsSingleId">
          <el-option
              :key = "sitem.idInformations"
              :label = "sitem.sysName"
              :value = "sitem.idInformations"
              v-for = "sitem in informationsSingleIdList"
          >
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label = "添加时间">
        <el-date-picker
            end-placeholder = "结束日期" placeholder = "请选择添加时间"
            range-separator = "到"
            start-placeholder = "开始日期"
            type = "daterange"
            v-model = "searchForm.createdDate"
        />
      </el-form-item>
      <el-form-item label = "     ">
        <el-button @click = "dataSearch" link type = "primary">
          <user-icon icon = "search"/>
          <span style = "vertical-align: middle;"> 查询 </span>
        </el-button>
        <el-button @click = "dataSearch(1)" link small>
          <span style = "vertical-align: middle;"> 重置 </span>
        </el-button>
      </el-form-item>
    </el-form>
    <el-divider/>


    <star-horse-button-list
        :permission = "permission"
        :upload-url = "uploadUrl"
        @upload = "upload"
        @uploadProcess = "uploadProcess"
        @uploadError = "uploadError"
        @uploadSuccess = "uploadProcess"
        @btnOperation = "btnOperation"
    />
    <el-table
        :data = "dataList" :row-key = "getRowIdentity"
        @row-dblclick = "editData"
        @selection-change = "handleSelectionChange"
        border
        class = "data_table"
        fit = "true"
        highlight-current-row = "true"
        id = "menusinfoPo"
        ref = "multipleTable"
        stripe = "true"
    >
      <el-table-column fixed width = "1"/>
      <el-table-column
          :reserve-selection = "true"
          align = "center"
          fixed = "left"
          type = "selection"
      />
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "主键"
          min-width = "200px"
          prop = "idMenusinfo"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统名称"
          min-width = "200px"
          prop = "informationsPo.sysName"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单名称"
          min-width = "200px"
          prop = "menuName"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单路径"
          min-width = "200px"
          prop = "menuPath"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单图标"
          min-width = "200px"
          prop = "menuIcon"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单顺序"
          min-width = "120px"
          prop = "dataIndex"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单描述"
          min-width = "200px"
          prop = "menuDesc"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统编号"
          min-width = "200px"
          prop = "dataNo"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单编码"
          min-width = "200px"
          prop = "menuCode"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "父菜单"
          min-width = "200px"
          prop = "parentNo"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改人"
          min-width = "200px"
          prop = "updatedBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改日期"
          min-width = "200px"
          prop = "updatedDate"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建人"
          min-width = "200px"
          prop = "createdBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建日期"
          min-width = "200px"
          prop = "createdDate"
          sortable
          v-if = " true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "是否删除 1 是 0否"
          min-width = "200px"
          prop = "isDel"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态编码"
          min-width = "200px"
          prop = "statusCode"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态名称"
          min-width = "200px"
          prop = "statusName"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column fixed = "right" label = "操作" min-width = "180px">
        <template #default = "scope">
          <el-button v-if = "permission.edit" @click = "editById(scope.row[primaryKey])" link title = ""
                     type = "primary">
            <el-tooltip content = "编辑">编辑</el-tooltip>
          </el-button>
          <el-button v-if = "permission.view" @click = "viewById(scope.row[primaryKey])" link title = ""
                     type = "primary">
            <el-tooltip content = "查看">查看</el-tooltip>
          </el-button>
          <el-button v-if = "permission.delete" @click = "deleteById(scope.row[primaryKey])" link title = ""
                     type = "danger">
            <el-tooltip content = "删除">删除</el-tooltip>
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-divider/>
    <el-pagination
        :total = "totalData"
        @current-change = "pageChangeClick"
        @size-change = "pageSizeClick"
        layout = "total, sizes, prev, pager, next, jumper"
        v-model:currentPage = "currentPage"
        v-model:page-size = "pageSize"
        v-model:pageCount = "totalPage"/>
  </el-card>
</template>
<style>
</style>
<script>
import icon from "../../assets/icon";
import {confirm, error, success, warning} from "../../utils/message";
import {getRequest, postRequest} from "../../api/star_horse";

import {common} from "../../api/common";
import {ref} from "vue";

export default {
  name: "MenusinfoEntity",

  mixins: [common],
  setup() {
    const buttonRef = ref();
    return {buttonRef}
  },
  data() {
    const loadByPageUrl = ref("/system-config/system/menusinfoEntity/pageList");
    const mergeUrl = ref("/system-config/system/menusinfoEntity/merge");
    const mergeDraftUrl = ref("/system-config/system/menusinfoEntity/mergeDraft");
    const batchMergeUrl = ref("/system-config/system/menusinfoEntity/mergeBatch");
    const batchMergeDraftUrl = ref("/system-config/system/menusinfoEntity/mergeBatchDraft");
    const loadByIdUrl = ref("/system-config/system/menusinfoEntity/getById");
    const deleteUrl = ref("/system-config/system/menusinfoEntity/batchDeleteById");
    const exportAllUrl = ref("/system-config/system/menusinfoEntity/exportData");
    const userConditionUrl = ref("/system-config/system/menusinfoEntity/getAllByCondition");
    const downloadTemplateUrl = ref("/system-config/system/menusinfoEntity/downloadTemplate");
    const uploadUrl = "/system-config/system/menusinfoEntity/importData";
    const primaryKey = "idMenusinfo";
    return {
      uploadUrl,
      loadByPageUrl,
      mergeUrl,
      mergeDraftUrl,
      batchMergeUrl,
      batchMergeDraftUrl,
      loadByIdUrl,
      deleteUrl,
      exportAllUrl,
      userConditionUrl,
      downloadTemplateUrl,
      primaryKey,
      rules: {
        idMenusinfo: [{required: false, message: "必选项不能为空", trigger: "blur"}],
        sourceInformationsSingleId: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        informationsSingleId: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        statusCode: [{required: false, message: "必选项不能为空", trigger: "blur"}],
        menuName: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        menuPath: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        menuIcon: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        menuCode: [{required: true, message: "必选项不能为空", trigger: "blur"}],
      },
      informationsSingleIdList: [],
      unAssignData: [],
      iconList: icon,
      currentLineInfo: {},
      moveDialogVisible: false,
      appMenusList: [],
      toData: [],
    }
  },
  methods: {
    moveMerge() {
      let that = this;
      confirm("确定要移动菜单吗？", function (ok) {
        if (!ok) {
          return;
        }
        that.$refs.ruleForm.validate((valid) => {
          if (!valid) {
            return;
          }
          let data = that.toData;
          if (data.length == 0) {
            warning("请选择要移动的菜单");
          }
          console.log(that.ruleForm.informationsSingleId);
          for (let key in data) {
            let temp = data[key];
            temp["informationsSingleId"] = that.ruleForm.informationsSingleId;
          }
          that.doMerge(data, that.batchMergeUrl, true);
        });
      });
      console.log(this.toData);
    },
    moveSelectionChange(val) {
      this.toData = val;
    },
    moveMenu() {
      let _this = this;
      _this.ruleForm = {};
      _this.appMenusList = [];
      _this.moveDialogVisible = true;

    },
    selectIcon(icon) {
      let dataList = this.ruleForm.batchDataList;
      for (let index in dataList) {
        let temp = dataList[index];
        if (temp.xh == this.currentLineInfo.xh) {
          temp["menuIcon"] = icon;
          break;
        }
      }
    },
    iconOper(strip, event) {
      this.currentLineInfo = strip.row;
    },
    addDataFun() {
      this.ruleForm = {
        batchDataList: [{}]
      };
      this.dialogTableVisible = !this.dialogTableVisible;
      this.dialogTitle = "新增数据";
    },
    handleAddDetails(row, type) {
      if (!this.ruleForm.batchDataList) {
        this.ruleForm.batchDataList = [];
      }
      if (type === 1) {
        let obj = {};
        this.ruleForm.batchDataList.push(obj);
      } else {
        this.ruleForm.batchDataList.splice(row.xh - 1, 1);
      }
    },
    querySearchName(str, cb) {
      let data = str ? this.unAssignData.filter(item => item.menuName.toLowerCase().match(str.toLowerCase())) : this.unAssignData;
      console.log(str, data);
      cb(data);
    },
    querySearchUrl(str, cb) {
      let data = str ? this.unAssignData.filter(item => item.menuPath.toLowerCase().match(str.toLowerCase())) : this.unAssignData;
      cb(data);
    },


    /**
     * 根据系统加载菜单
     * */
    loadMenus(newVal, oldVal) {
      let _this = this;
      console.log(newVal);
      let param = [{propertyName: "informationsSingleId", value: newVal}];
      _this.getAllByCondition(param, function (data) {
        _this.appMenusList = data;
      })
    },

    operMenu(data, redata) {
      let param = [];
      let that = this;
      param.push({
        "propertyName": "informationsSingleId",
        "value": data.idInformations
      })
      that.getAllByCondition(param, function (data) {
        if (redata) {
          let tempData = redata.filter(item => !data.find(it2 => item.path === it2.menuPath));
          tempData.forEach(item => data.push({
            menuPath: item.path,
            menuName: item.name
          }));
        }
        that.unAssignData = data;
      });
    },
    /**
     * 更改菜单
     */
    changeMenusName(scope) {
      let data = this.menuPathList.find(item => item.name === scope.row.menuName);
      scope.row.menuPath = data.path;
      this.chekIsDubble(scope, data.path);

    },
    chekIsDubble(scope, path) {
      let that = this;
      let query = [];
      query.push({
        propertyName: "menuPath",
        value: path
      });
      query.push({
        propertyName: "informationsSingleId",
        value: that.ruleForm.informationsSingleId
      });
      that.getAllByCondition(query, function (data) {
        if (data && data.length > 0) {
          warning("该菜单已配置,不能重复配置");
          scope.row.menuName = "";
          scope.row.menuPath = "";
        }
      });
    },

    dataFormat(row, column, cellValue, index) {
      cellValue = this.commonDataFormat(row, column, cellValue, index);
      if (column.property == "parentNo") {
        return row.parentData ? row.parentData.menuName : "--";
      }
      return cellValue;
    },


    /**
     * 初始化数据
     */
    init: function () {
      this.dataList = [];
      this.selectData = [];
      this.loadByPage(this.currentPage, this.pageSize);
      this.informationsSingleIdListFun();
      this.commonSelectData("menusinfo");
      this.loadParentNode();
      this.loadPermissionResources();
    },

    getAllByCondition(param, callback) {
      postRequest(this.userConditionUrl, param).then(res => {
        let redata = res.data.data;
        if (callback) {
          callback(redata);
        }
      }).catch(err => {
        error(err);
      });
    },
    /**
     * 加载父级数据
     */
    loadParentNode() {
      let that = this;
      let query = [];
      that.getAllByCondition(query, function (data) {
        that.parentNodeList = data;
      });
    },
    /**
     * 系统信息
     */
    informationsSingleIdListFun() {
      let that = this;
      let query = [];
      postRequest("/system-config/system/informationsEntity/getAllByCondition", query).then(res => {
        let redata = res.data;
        that.informationsSingleIdList = redata.data;
      }).catch(err => {
        error("网络异常或者接口错误");
      });
    }
    ,

    parseSearchData: function () {
      let data = this.searchForm;
      let arr = [];
      if (data.menuName) {
        arr.push({
          propertyName: "menuName",
          value: data.menuName,
          operation: "lk"
        });
      }
      if (data.createdDate) {
        arr.push({
          propertyName: "createdDate",
          value: data.createdDate,
          operation: "bt"
        });
      }
      if (data.informationsSingleId) {
        arr.push({
          propertyName: "informationsSingleId",
          value: data.informationsSingleId,
          operation: "eq"
        });
      }
      return arr;
    },
    loadById: function (id, isView) {
      let that = this;
      that.load();
      getRequest(that.loadByIdUrl + (isView ? "ForView" : "") + "/" + id).then(res => {
        let redata = res.data.data;
        if (!redata) {
          warning("未找到对应数据");
          return;
        }
        that.ruleForm = redata;
        // that.ruleForm["batchDataList"] = [redata];
        if (isView) {
          this.viewVisible = !this.viewVisible;
        } else {
          this.dialogTableVisible = !this.dialogTableVisible;
        }
      }).catch(err => {
        error("操作异常 " + err);
      }).finally(() => {
        that.closeLoad();
      })
    },
    /**
     * 批量编辑保存数据
     */
    batchMerge: function () {
      let that = this;
      that.$refs.ruleForm.validate((valid) => {
        if (!valid) {
          return;
        }
        let dataList = that.createData();
        that.doMerge(dataList, that.batchMergeUrl, false);
      });
    }
    ,
    createData() {
      let that = this;
      that.assignStatusName();
      let dataList = that.ruleForm.batchDataList;
      dataList.forEach(item => {
        item["informationsSingleId"] = that.ruleForm.informationsSingleId;
        item["statusCode"] = that.ruleForm.statusCode;
        item["statusName"] = that.ruleForm.statusName;
        item["batchDataList"] = null;
      });
      dataList["batchDataList"] = null;
      return dataList;
    },
    doMerge(dataList, url, isMove) {
      let that = this;
      that.load();
      postRequest(url, dataList).then(res => {
        that.closeLoad();
        if (res.data.code == 1) {
          warning(res.data.cnMessage);
          return;
        }
        success(res.data.cnMessage);
        that.loadByPage(1, this.pageSize);
        if (isMove) {
          that.moveDialogVisible = !that.moveDialogVisible;
        } else {
          that.dialogTableVisible = !that.dialogTableVisible;
        }
      }).catch(err => {
        error("操作异常 " + err);
      }).finally(() => {
        that.closeLoad();
      })
    },
    /**
     * 批量编辑保存草稿数据
     */
    batchMergeDraft: function () {
      let that = this;
      let dataList = that.createData();
      that.doMerge(dataList, that.batchMergeDraftUrl, false);
    }
  },
  created() {
    this.init();
  }
}
</script>